import React from 'react';
import base64url from "base64url";
import { connect } from 'dva'
import { routerRedux } from 'dva/router';
import { Icon, List, WhiteSpace, Flex, NoticeBar,Progress,Button} from 'antd-mobile';
import Rank from './../../Mine/rankListIteam/ranklistPerson'
import { createForm } from 'rc-form';
import styles from './hdadminister.less'



class hdadminister extends React.Component{
  constructor(props){
    super(props);
    this.state={
      percent: 67,
      percent1: 95,
      percent2: 97,
      percent3: 100,
      percent4: 59,

    }
  }
  Activityentry =()=>{
    this.props.dispatch(
      routerRedux.push({
        pathname: `/work/hdadminister/activityentry`
      })
    );
  };

  render(){
    const orgList = [];
    const orgData = this.props.list;
    for (let key in orgData) {
      orgList.push(orgData[key])
    }
    const Item = List.Item;
    const Brief = Item.Brief;
    const { percent,percent1,percent2,percent3,percent4 } = this.state;

    return(
      <div>

        <div className={styles.bg} style={{width:'97%',height:'3.8rem'}}>
          <div style={{width:'100%',height:'1rem'}}>
            <div style={{width:'59%',height:'1rem',display:'inline-block'}}><Icon size="md" style={{verticalAlign:'middle'}} type={require('../../../svgs/work/shu.svg')} /><span  style={{verticalAlign:'middle'}}>三会一课[2017年10月]</span></div>
            <div className={styles.bbtn} onClick={this.Activityentry}><Icon size="md" style={{verticalAlign:'sub'}} type={require('../../../svgs/work/jia.svg')} />活动录入</div>
          </div>
          <Flex style={{marginTop:'0.3rem'}}>
            <Flex.Item>
              <span style={{fontSize:'0.5rem'}}>1520</span><br/>
              <span>召开支委会次数</span>
            </Flex.Item>
            <Flex.Item>
              <span style={{fontSize:'0.5rem'}}>1520</span><br/>
              <span>召开党员大会次数</span>
            </Flex.Item>
          </Flex>
          <Flex style={{marginTop:'0.3rem'}}>
            <Flex.Item>
              <span style={{fontSize:'0.5rem'}}>1520</span><br/>
              <span>召开党小组会次数</span>
            </Flex.Item>
            <Flex.Item>
              <span style={{fontSize:'0.5rem'}}>1520</span><br/>
              <span>上党课次数</span>
            </Flex.Item>
          </Flex>
        </div>

        <WhiteSpace/>
        <NoticeBar  mode="link" icon={<Icon type={require('../../../svgs/work/duoren.svg')}/>} action={<span style={{ color: '#a1a1a1' }}>5分钟前</span>}>
          &nbsp;&nbsp;某某支部召提交的活动待您审批
        </NoticeBar>
        <WhiteSpace/>

        {this.props.list&&
          <List className="my-list">
            {
              orgList.map((it) => {
                return <Item extra={<div>
                  <div className="show-info">
                    <Progress percent={percent} position="normal"/>
                    <span aria-hidden="true" className={styles.itemspan}>{percent}%</span>
                  </div>
                </div>}>
                  {it.name.length>15?it.name.substring(0,15)+"...":it.name}
                  <p className={styles.numbers}>
                      <span>支委会：12</span>
                      <span>党员大会：14</span>
                    <br/>
                      <span>党小组会：56</span>
                      <span>党课：3</span>
                  </p>
                </Item>
              })
            }
          </List>
        }

      </div>
    )
  }
}

function mapStateToProps({organizationss}) {
    return {
      list: organizationss.orgLists
    }
}

export default connect(mapStateToProps)(hdadminister);
